<template>
	<view class="uni_box home">
		<navbar title='有偿收录'>
		</navbar>
		<view class="content">
			<view class="xlist">
				<u-empty text="暂无数据" mode="list" v-if="list == ''"></u-empty>
				<view class="xitem" v-for="(item,index) in list" :key="index" @click="toDtail(item)">
					<view class="jone">
						<view class="jishu">
							{{item.city}}
						</view>
						<text class="time">待收录</text>
					</view>
					<image class="qiexian" src="@/pages_subject/static/img/qiexian.png" mode="" />
					<view class="xinlist">
						<view class="xinitem">
							考研年份：{{ item.year }}
						</view>
						<view class="xinitem">
							考点所在城市：{{ item.city }}
						</view>
						<!-- <view class="xinitem">
							所在学校：{{ item.school }}
						</view> -->
						<view class="xinitem">
							报考学校：{{ item.school }}
						</view>
					</view>
					<view class="chakan">
						<view class="chabtn" @click="toDetail(item)">查看详情</view>
					</view>
				</view>
				<!-- <u-loadmore :status="status" @loadmore="loadmore" style="margin-top: 30rpx;" /> -->
			</view>

			<view class="shoulubtn">
				<view class="lubtn" @click="shouluadd">有偿收录</view>
			</view>
		</view>
		<!-- <view class="botview">
			<view class="botleft">
				<image class="icon_fenxiang" src="/static/icon_fenxiang.png" mode="" />
				<text>分享</text>
			</view>
			<view class="lianxi" :style="{
				background:Themecolor
			}">
				联系客服
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				current: 0,
				list: [],
				page: 1,
				limit: 10,
				last_page: 1,
				status: "loadmore",
			}
		},
		onLoad() {

			// console.log(this.Themecolor)
			
		},
		onShow() {
			this.page = 1
			this.getList()
		},
		onReachBottom: function () {
			this.loadmore();
		},
		methods: {
			change(index) {
				this.current = index;
			},
			toDetail(item){
				this.navrouter("/pages_subject/twoPage/youchang?id="+item.id+'&type=edit');
			},
			shouluadd(){
				this.navrouter("/pages_subject/twoPage/youchang?type=add");
			},
			async getList(){
				let res = await this.$u.api.getUserDianList({
					page:this.page,
					shop_id:uni.getStorageSync('shop_id')
				});
				// console.log(res)
				this.last_page = res.lastpage;
				// let shuju = res.data
				// for(let i in shuju){
				// 	shuju[i].iszhan = false
				// }
				
				let list = res.data;
				this.list = this.page == 1 ? list : [...this.list, ...list];	
				// console.log(this.list)
				if(this.page >= this.last_page){
				this.status = 'nomore';
				}
			},
			loadmore() {
				let page = this.page;
				// let last_page = this.last_page;
				if (this.status == 'loadmore') {
					this.page++;
					this.getList();
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #fff;
	}
	.content{
		background-color: #fff;
		padding-bottom: 150rpx;
		min-height: 100vh;
		// padding: 30rpx;
		.xlist{
			display: flex;
			flex-direction: column;
			padding: 30rpx;
			.xitem{
				background: #FFFFFF;
				box-shadow: 0rpx 0rpx 18rpx 0rpx rgba(196,198,255,0.39);
				border-radius: 10rpx;
				.jone{
					display: flex;
					flex-direction: row;
					align-items: center;
					padding: 20rpx 30rpx 0rpx;
					.jishu{
						font-size: 32rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #333333;
					}
					.time{
						margin-left: auto;
						font-size: 26rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #216CFE;

					}
				}
			}
			.qiexian{
				width: 100%;
				height: 7rpx;
				// margin-bottom: 30rpx;
			}
			.xinlist{
				display: flex;
				flex-direction: column;
				// padding-bottom: 35rpx;
				padding:30rpx;

				.xinitem{
					display: flex;
					margin-bottom: 25rpx;
					font-size: 26rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #333333;
				}
				.xinitem:last-child{
					margin-bottom: 0;
				}
			}
			.chakan{
				border-top: 1rpx solid #EEEEEE;
				display: flex;
				align-items: center;
				justify-content: flex-end;
				padding: 20rpx;
				.chabtn{
					margin-left: auto;
					padding: 14rpx 25rpx;
					background: linear-gradient(0deg, #FF8C53 0%, #FF4E87 100%);
					border-radius: 10rpx;
					font-size: 26rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
				}
			}
		}
	}
	.botview{
			height: 120rpx;
			background: #FFFFFF;
			width: 100%;
			position: fixed;
			bottom: 0;
			display: flex;
			flex-direction: row;
			align-items: center;
			z-index: 10;
			border-top: 1rpx solid #eee;
			padding: 0 30rpx 20rpx 0;
			.botleft{
				width: 20%;
				display: flex;
				align-items: center;
				justify-content: center;
				flex-direction: column;
				.icon_fenxiang{
					width: 44rpx;
					height: 44rpx;

				}
				text{
					font-size: 18rpx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #333333;
				}
			}
			.lianxi{
				margin-left: auto;
				width: 75%;
				height: 72rpx;
				background: #AC1F33;
				border-radius: 10rpx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
			}
		}
	.zhanwei{
		height: 20rpx;
		width: 100%;
		background-color: #f6f6f6;
	}
	.shoulubtn{
		position: fixed;
		width: 100%;
		bottom: 0;
		height: 120rpx;
		background-color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		left: 0;
		// padding: 0 30rpx;
		.lubtn{
			height: 88rpx;
			width: 94%;
			display: flex;
			align-items: center;
			justify-content: center;
			background: #FF8C53;
			border-radius: 10rpx;
			color: #fff;
			font-size: 30rpx;
			font-weight: 500;
			margin: o auto;
		}
	}
</style>
